<!DOCTYPE html>
<html class="x-admin-sm">
{include file='public/header'}
<link rel="stylesheet" href="/admin/xadmin/lib/layui/css/inputTag.css">
<script src="/admin/xadmin/lib/layui/upload.js" charset="utf-8"></script>
<script type="text/javascript" src="/admin/xadmin/lib/layui/inputTag.js" charset="utf-8"></script>
<style>
    /* #stages {
        width: 60%;
        display: flex;
        flex-direction: column;
        margin-left: 165px;
    } */

    .stage {

        display: flex;
        align-items: center;

    }

    .pMenus .layui-input-block {
        margin-left: 0px;
    }
</style>

<body>
    <div class="x-body">
        <form class="layui-form" lay-filter="formAjax">

            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>平台类型
                </label>
                <div class="layui-input-block">
                    <select name="type" id="">
                        <option value="">请选择</option>
                        <option value="1">微信小程序</option>
                        <option value="2">抖音小程序</option>
                        <option value="3">快手小程序</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>小程序名称
                </label>
                <div class="layui-input-block">
                    <input type="text" name="name" id="name" placeholder="小程序名称" required="required"
                        lay-verify="required" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>app_id
                </label>
                <div class="layui-input-block">
                    <input type="text" name="app_id" id="app_id" placeholder="小程序app_id" required="required"
                        lay-verify="required" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>app_secret
                </label>
                <div class="layui-input-block">
                    <input type="text" name="app_secret" id="app_secret" placeholder="小程序appsecret" required="required"
                        lay-verify="required" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    原始ID
                </label>
                <div class="layui-input-block">
                    <input type="text" name="origin_id" id="origin_id" placeholder="小程序原始ID" required="" lay-verify=""
                        autocomplete="off" class="layui-input" value="" />
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">
                    token
                </label>
                <div class="layui-input-block">
                    <input type="text" name="token" id="token" placeholder="小程序token" required="" lay-verify=""
                        autocomplete="off" class="layui-input" value="" />
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">
                    支付SALT值
                </label>
                <div class="layui-input-block">
                    <input type="text" name="salt" id="salt" placeholder="小程序支付SALT值" required="" lay-verify=""
                        autocomplete="off" class="layui-input" value="" />
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>url
                </label>
                <div id="pMenu" style="width:100%;flex:1"></div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>iOS支付
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="ios_pay_switch" value="1" title="开启" checked>
                    <input type="radio" name="ios_pay_switch" value="0" title="关闭">
                </div>
            </div>
            <div class="layui-form-item" style="display: none;">
                <label class="layui-form-label">
                    <span class="x-red">*</span>分享
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="share_switch" value="1" title="开启" >
                    <input type="radio" name="share_switch" value="0" title="关闭" checked>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    活动
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="activity_pay_show" value="1" title="开启">
                    <input type="radio" name="activity_pay_show" value="0" title="关闭" checked>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    虚拟支付
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="virtual_pay_switch" value="1" title="开启">
                    <input type="radio" name="virtual_pay_switch" value="0" title="关闭" checked>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>状态
                </label>
                <div class="layui-input-block">
                    <input type="radio" name="status" value="1" title="开启" checked>
                    <input type="radio" name="status" value="0" title="关闭">
                </div>
            </div>
            
            <div class="layui-form-item">
                <label class="layui-form-label">
                    包名
                </label>
                <div class="layui-input-block">
                    <input type="text" name="package" id="package" placeholder="包名" autocomplete="off"
                        class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    消息模板ID
                </label>
                <div class="layui-input-block">
                    <div class="fairy-tag-container">
                        <input type="text" class="fairy-tag-input messageID" autocomplete="off" value="">
                    </div>
                    <div class="layui-form-mid layui-word-aux">回车键确认，返回键删除</div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>收藏图片
                </label>
                <button type="button" class="layui-btn" id="photo_btn">上传</button>
                <div class="layui-upload-list" style="display: none;margin-left: 110px;">
                    <img onclick="showimg(this)" class="layui-upload-img" style="width: 100px;background-color: #ccc;">
                </div>
                <input type="hidden" name="share_img_url" id="share_img_url" value="" />
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>公司主体
                </label>
                <div class="layui-input-block">
                    <select name="company_entity_id" id="company_entity_id">
                        <option value="">请选择</option>
                        <option value="1">比翼鸟公司主体</option>
                        <option value="3">南宁源誉网络科技主体</option>
                        <!-- <option value="3">星灿主体</option>
                        <option value="4">揽阅主体</option>
                        <option value="5">品众主体</option> -->
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    掌中付比率
                </label>
                <div class="layui-input-block">
                    <input type="text" name="payment_rate[zhangzhongfu]" id="zhangzhongfu" placeholder="掌中付比率"
                        required="" lay-verify="" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    米花小程序跳转（比翼鸟主体）比率
                </label>
                <div class="layui-input-block">
                    <input type="text" name="payment_rate[mihua_jump_liuyi]" id="mihua_jump_liuyi" placeholder="米花小程序跳转（比翼鸟主体）比率" required=""
                           lay-verify="" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item"  style="display: none;">
                <label class="layui-form-label">
                    米花小程序跳转（大连趣漫）比率
                </label>
                <div class="layui-input-block">
                    <input type="text" name="payment_rate[mihua_jump_dalianquman]" id="mihua_jump_dalianquman" placeholder="米花小程序跳转（大连趣漫）比率" required=""
                           lay-verify="" autocomplete="off" class="layui-input" value="0" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    虚拟支付比率
                </label>
                <div class="layui-input-block">
                    <input type="text" name="payment_rate[virtual_payment]" id="virtual_payment" placeholder="虚拟支付比率"
                        required="" lay-verify="" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    扫码富
                </label>
                <div class="layui-input-block">
                    <input type="text" name="payment_rate[saomafu_payment]" id="saomafu_payment" placeholder=" 扫码富"
                        required="" lay-verify="" autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    客服ID
                </label>
                <div class="layui-input-block">
                    <input type="text" name="customer_service_id" id="customer_service_id" placeholder="请输入客服ID"
                        autocomplete="off" class="layui-input" value="" />
                </div>
            </div>
            <div class="layui-form-item" >
                <label class="layui-form-label">
                    短剧分组
                </label>
                <div id="pVideoTemplate" style="width: 100%;flex: 1;"></div>
            </div>
            <input type="hidden" name="id" id="id" value="" />
            <input type="hidden" name="template_id" id="template_id" value="" />
            <button id="submitData" class="layui-btn" lay-submit lay-filter="submitData" style="display: none;" />

        </form>
    </div>
    <script>
        let params = {
            addUrl: '/admin/applet/add',
            editUrl: '/admin/applet/edit',
            detailUrl: '/admin/applet/detail',
        }
        form_ajax(params)
        let id = GetQueryString('id')
        let selectParams = {
            url: '/admin/applet/getJumpUrlSelect',
            selected: [],
            tips: '选择url',
            name: 'url',
            field_id: 'value',
            field_Name: 'name',
            elem: '#pMenu'
        }
        let xmSelectVideoOption = {
            url: '/admin/video_template/select',
            selected: [],
            tips: '选择短剧分组',
            name: 'vt_id',
            field_id: 'id',
            field_Name: 'name',
            elem: '#pVideoTemplate'
        }
        let template_id = []
        if (id) {
            Ajax(params.detailUrl, { id }).then(result => {
                selectParams.selected = [result.data.url]
                selectN(selectParams)
                xmSelectVideoOption.selected=[result.data.vt_id]
                selectN(xmSelectVideoOption)
                template_id = result.data.template_id!= '' ? result.data.template_id?.split(',') ?? [] : []
                setInputTag(template_id)
                if(result.data.share_img_url){
                    $('.layui-upload-list').show()
                    $('.layui-upload-img').attr('src', result.data.share_img_url);
                    $("input[name='share_img_url']").val(result.data.share_img_url);
                }
                if (result.data.payment_rate){
                    $("input[name='payment_rate[zhangzhongfu]']").val(result.data.payment_rate.zhangzhongfu);
                    $("input[name='payment_rate[mihua_jump_liuyi]']").val(result.data.payment_rate.mihua_jump_liuyi);
                    $("input[name='payment_rate[mihua_jump_dalianquman]']").val(result.data.payment_rate.mihua_jump_dalianquman);
                    $("input[name='payment_rate[virtual_payment]']").val(result.data.payment_rate.virtual_payment);
                    $("input[name='payment_rate[saomafu_payment]']").val(result.data.payment_rate.saomafu_payment ? result.data.payment_rate.saomafu_payment : 0);
                }
            });
        } else {
            selectN(selectParams)
            selectN(xmSelectVideoOption)
            setInputTag()
        }

        uploadFile({
            elem: '#photo_btn', 
            ossUrl:'/admin/video/uploadCredentials',
            uploadSuccessCallback: function (res) {
                $('.layui-upload-list').show()
                $('.layui-upload-img').attr('src', res.url);
                $("input[name='share_img_url']").val(res.url);
            }, 
            uploadErrorCallback: function() {
                return layer.msg('上传失败');
            }
        })

        function setInputTag(template_id){
            inputTag({
                elem: '.messageID',
                data:template_id,
                onChange:function(data, value, type){
                    $('#template_id').val(data.toString());
                }
            })
        }
    </script>
</body>

</html>